<template>
  <div>
    <div class="box">
      <div class="title-scroll">企业名称</div>
      <div class="title-scroll">
        {{ baseInfo.tenantName || '&#45;&#45;' }}
      </div>

      <div class="title-scroll">统一信用代码</div>
      <div class="title-scroll">
        {{ baseInfo.uscCode || '&#45;&#45;' }}
      </div>
    </div>
    <div class="box">
      <div class="title-scroll">出口备案状态</div>
      <div class="title-scroll">
        {{ logoutTypeObj[afterLoanRsp.status] || '&#45;&#45;' }}
      </div>

      <div class="title-scroll">分类等级</div>
      <div class="title-scroll">
        {{ afterLoanRsp.managementLevel || '&#45;&#45;' }}
      </div>
    </div>
    <div class="box">
      <div class="title-scroll">是否列入黑名单</div>
      <div class="title-scroll">
        {{ hmdTypeObj[afterLoanRsp.riskType] || '&#45;&#45;' }}
      </div>

      <div class="title-scroll">年销售收入</div>
      <div class="title-scroll">{{ afterLoanRsp.annualSalesRevenue || '&#45;&#45;' }}万元</div>
    </div>

    <div class="box">
      <div class="title-scroll">当前欠税金额</div>
      <div class="title-scroll">{{ afterLoanRsp.ownTaxamount || '&#45;&#45;' }}元</div>

      <div class="title-scroll">近1年暂缓退税和不予退税率</div>
      <div class="title-scroll">
        {{ afterLoanRsp.refundRate || '&#45;&#45;' }}
      </div>
    </div>

    <div class="box">
      <div class="title-scroll">近1年退税申报次数</div>
      <div class="title-scroll">
        {{ afterLoanRsp.declareNumber || '&#45;&#45;' }}
      </div>

      <div class="title-scroll">近1年退税申报额</div>
      <div class="title-scroll">{{ afterLoanRsp.approvedRebeatTax || '&#45;&#45;' }}万元</div>
    </div>

    <div class="box">
      <div class="title-scroll">近1年出口明细比数</div>
      <div class="title-scroll">
        {{ afterLoanRsp.exportdetailNum || '&#45;&#45;' }}
      </div>

      <div class="title-scroll">当前退税账户是否锁定</div>
      <div class="title-scroll">
        <el-switch v-model="isLocked" @change="changeLock"> </el-switch>
      </div>
    </div>
  </div>
</template>

<script>
export default {
  name: 'CompanyInfodz',
  props: {
    baseInfo: Object,
    afterLoanRsp: Object,
  },
  watch: {
    'baseInfo.lockingStatus': {
      deep: true,
      handler: function (newV, oldV) {
        this.isLocked = newV === '1' ? false : true
      },
    },
  },
  data() {
    return {
      isLocked: false,
      logoutTypeObj: {
        Y: '注销',
        N: '正常',
      },
      hmdTypeObj: {
        Y: '是',
        N: '否',
      },
    }
  },
  methods: {
    async changeLock() {
      let e = this.baseInfo.lockingStatus
      const res = await this.$http.post('/ents/updateUserLockingStatus', {
        type: e === '1' ? '0' : '1',
        uscCode: this.baseInfo.uscCode,
      })
      if (res) {
        this.$emit('change-lock')
      }
    },
  },
}
</script>
<style lang="scss" scoped>
.box {
  @include flex();
  flex-wrap: wrap;
  border-left: 1px solid $gray-lighter;
  border-top: 1px solid $gray-lighter;
  border-right: 1px solid $gray-lighter;
  &:last-child {
    border-bottom: 1px solid $gray-lighter;
  }

  > div {
    width: 25%;
    height: 40px;
    text-align: center;
    line-height: 40px;
    color: $gray;
    &:not(:nth-child(4n)) {
      border-right: 1px solid $gray-lighter;
    }
    &:first-child,
    &:nth-child(3) {
      background-color: #fafafa;
    }
  }
}
.title-scroll {
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
  -o-text-overflow: ellipsis;
}
</style>
